/**
 * Author: Nam Nguyen (khoanam.nguyen@vitagi.com or ngkhnam@gmail.com) 
 */

if(!vitagi){
	var vitagi = {};
}

/**
 * 
 * @param {} opt
 * @returns {vitagi.timeslide}
 */
vitagi.timeslide = function(opt){
	this.opt = opt;
	this.elContainer = opt.container;
	this.elContainer.style.position = "absolute";
	this.elContainer.style.zIndex = 1;
	this.elContainer.style.width = "100%";
	this.elContainer.style.height = opt.height + "px";
	this.elContainer.style.overflow = "hidden";
	this.currentSlide = null;
	this.elContent = null;
	this.currIndex = 0;
	this.arrSlideIcon = new Array();
	this.enable = true;
};

vitagi.timeslide.prototype ={
	/**
	 * 
	 * @param {} opt
	 */
	createSlide: function(opt){
		var li = document.createElement("li");
		li.style.listStyle ="none";
		li.style.margin ="0px";
		li.style.padding ="0px";
		li.style.setProperty("float","left", null);
		
		var div = document.createElement("div");
		var img = document.createElement("img");
		img.src = opt.src;
		img.style.width = opt.width + "px";
		div.appendChild(img);
		li.appendChild(div);
		
		return li;
	},
	
	create: function(){
		var ul = document.createElement("ul");
		ul.style.listStyle = "none";
		ul.style.padding ="0px";
		ul.style.margin ="0px";
		ul.style.position = "absolute";
		ul.style.width = (this.opt.slides.length * this.opt.slides[0].width) + "px";
		
		var li = this.createSlide(this.opt.slides[0]);
		ul.appendChild(li);
		this.elContainer.appendChild(ul);
		this.currentSlide = li;
		this.elContent = ul;
		this.createNavigationBar();
		
		var that = this;
		$(this.elContainer).bind("mouseout", function(e){
			if(!that.timer.isRuning)
				that.timer.start();
		});
	},
	
	createNavigationBar:function(elBarContainer){
		var div = document.createElement("div");
		var a;
		var img;
		var that = this;
		
		div.style.position = "absolute";
		div.style.right = "10px";
		div.style.top = "100px";
		div.style.zIndex = 1100;
		
		for(var i = 0 ; i < this.opt.slides.length; i++){
			a =  document.createElement("a");
			img = document.createElement('img');
			if(i == 0){
				img.src = "images/slideicon-on.png";
			}
			else{
				img.src = "images/slideicon.png";
			}
			
			img.style.height = "18px";
			img.style.width = "18px";
			img.id = "slideicon-" + i;
			img.indexSlide = i;
			a.href = "javascript:void(0)";
			a.style.margin = "0 5px";
			a.appendChild(img);
			$(img).bind("click", function(e){
				var index = this.indexSlide;
				if(that.timer.isRuning){
					that.timer.stop();
				}	
				if(index != that.currIndex){
					if(that.enable){
						that.enable = false;
						var li = that.createSlide(that.opt.slides[index]);
						that.elContent.appendChild(li);
						that.animationChangeSlide();
						that.arrSlideIcon[that.currIndex].src = "images/slideicon.png";
						that.currIndex = index;
						that.arrSlideIcon[index].src = "images/slideicon-on.png";
					}
				}
				
			});
			div.appendChild(a);
			
			this.arrSlideIcon.push(img);
		}
		this.elContainer.appendChild(div);
	},
	
	animationChangeSlide:function(){
		var that = this;
		$(this.elContent).stop().animate({
		    left: "-" + this.opt.slides[0].width + 'px'
		 }, 600, function() {
			 $(that.elContent).css("left","0px");
			 $(that.currentSlide).remove();
			 that.currentSlide = that.elContent.firstChild;
			 that.enable = true;
		 });
	},
	
	run: function(){
		count = 1;
		var that = this;
		this.timer = new vitagi.timer();
		this.timer.interval = 5000;
		this.timer.onTick = function(){
			count = that.currIndex + 1;
			if(count ==  that.opt.slides.length){
				count = 0;
			}
			var li = that.createSlide(that.opt.slides[count]);
			that.elContent.appendChild(li);
			that.animationChangeSlide();
			that.arrSlideIcon[that.currIndex].src = "images/slideicon.png";
			that.currIndex = count;
			that.arrSlideIcon[count].src = "images/slideicon-on.png";
		};
		this.timer.start();
	}
};


